<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--form表单-->
<form action="https://www.baidu.com" id="f" onsubmit="return form()">
  <input type="submit" value="按钮1" id="i1">
  <input type="text" placeholder="这是文本输入..." id="i2">
</form>

<script !src="">

  function form() {
    return true
  }


  // 加载完页面所有标签后才执行下面的内容！
  window.onload = function () {


    // f.onsubmit = function (){
    //   return true
    // }




    // 焦点事件
    i2.onfocus = function () {
      console.log('获取焦点事件...')
    }
    i2.onblur = function () {
      console.log("失去焦点事件...")
    }

    // i2.onmouseenter = function () {
    //   alert("鼠标进来了！")
    // }
    // i2.onmouseleave = function () {
    //   alert("鼠标移除了")
    // }

    i2.onkeydown = function (event) {
      console.log("键盘按下了！！！！！！")
      // 获取按下的键值
      console.log(event.key)
      console.log(event.keyCode)
    }


    // 改变事件
    i2.onchange = function () {
      alert("改变事件发生了")
    }

    // 表单事件

    // i2.addEventListener("onfocus",function (){
    //   console.log('获取焦点事件...')
    // })
    //
    // i2.addEventListener('onblur',function () {
    //   console.log("失去焦点事件...")
    // })
  }


</script>
</body>
</html>